<style>
	.layui-form-label {
		width: 90px;
		padding-right: 15px;
	}
	.layui-inline input{
		width: 193px;
	}
</style>
<div class="layuimini-main layuimini-panel loukou loukou-config-rw">
	<div class="layui-row layui-col-space15 layui-form" lay-filter="form-high">
		<div class="layui-col-md6">
			<div class="layui-card">
				<div class="layui-card-header">COM1</div>
				<div class="layui-card-body">
					<div class="">
						<div class="layui-form-item">
							<label class="layui-form-label">波特率</label>
							<div class="layui-inline">
								<select name="BAD1" lay-search="">
									<option value="0">600</option>
									<option value="1">1200</option>
									<option value="2">2400</option>
									<option value="3">4800</option>
									<option value="4">9600</option>
									<option value="5">19200</option>
									<option value="6">38400</option>
									<option value="7">57600</option>
									<option value="8">115200</option>
								</select>
							</div>
							<div class="layui-inline">
								<button type="button" class="layui-btn layui-btn-sm" id="BAD1">配置</button>
							</div>
						</div>
						<div class="layui-form-item">
							<label class="layui-form-label">效验位</label>
							<div class="layui-inline">
								<select name="CHC1" lay-search="">
									<option value="0">N无校验</option>
									<option value="1">E偶校验</option>
									<option value="2">O奇校验</option>
								</select>
							</div>
							<div class="layui-inline">
								<button type="button" class="layui-btn layui-btn-sm" id="CHC1">配置</button>
							</div>
						</div>

					</div>
				</div>
			</div>
		</div>
		<div class="layui-col-md6">
			<div class="layui-card">
				<div class="layui-card-header">COM2</div>
				<div class="layui-card-body">
					<div class="">
						<div class="layui-form-item">
							<label class="layui-form-label">波特率</label>
							<div class="layui-inline">
								<select name="BAD2" lay-search="">
									<option value="0">600</option>
									<option value="1">1200</option>
									<option value="2">2400</option>
									<option value="3">4800</option>
									<option value="4">9600</option>
									<option value="5">19200</option>
									<option value="6">38400</option>
									<option value="7">57600</option>
									<option value="8">115200</option>
								</select>
							</div>
							<div class="layui-inline">
								<button type="button" class="layui-btn layui-btn-sm" id="BAD2">配置</button>
							</div>
						</div>
						<div class="layui-form-item">
							<label class="layui-form-label">效验位</label>
							<div class="layui-inline">
								<select name="CHC2" lay-search="">
									<option value="0">N无校验</option>
									<option value="1">E偶校验</option>
									<option value="2">O奇校验</option>
								</select>
							</div>
							<div class="layui-inline">
								<button type="button" class="layui-btn layui-btn-sm" id="CHC2">配置</button>
							</div>
						</div>

					</div>
				</div>
			</div>
		</div>
	</div>
	<div class="layui-row layui-col-space15 layui-form" lay-filter="form-high">
		<div class="layui-col-md6">
			<div class="layui-card">
				<div class="layui-card-header">COM3</div>
				<div class="layui-card-body">
					<div class="">
						<div class="layui-form-item">
							<label class="layui-form-label">波特率</label>
							<div class="layui-inline">
								<select name="BAD1" lay-search="">
									<option value="0">600</option>
									<option value="1">1200</option>
									<option value="2">2400</option>
									<option value="3">4800</option>
									<option value="4">9600</option>
									<option value="5">19200</option>
									<option value="6">38400</option>
									<option value="7">57600</option>
									<option value="8">115200</option>
								</select>
							</div>
							<div class="layui-inline">
								<button type="button" class="layui-btn layui-btn-sm" id="BAD3">配置</button>
							</div>
						</div>
						<div class="layui-form-item">
							<label class="layui-form-label">效验位</label>
							<div class="layui-inline">
								<select name="CHC3" lay-search="">
									<option value="0">N无校验</option>
									<option value="1">E偶校验</option>
									<option value="2">O奇校验</option>
								</select>
							</div>
							<div class="layui-inline">
								<button type="button" class="layui-btn layui-btn-sm" id="CHC3">配置</button>
							</div>
						</div>

					</div>
				</div>
			</div>
		</div>
		<div class="layui-col-md6">
			<div class="layui-card">
				<div class="layui-card-header">COM4</div>
				<div class="layui-card-body">
					<div class="">
						<div class="layui-form-item">
							<label class="layui-form-label">波特率</label>
							<div class="layui-inline">
								<select name="BAD4" lay-search="">
									<option value="0">600</option>
									<option value="1">1200</option>
									<option value="2">2400</option>
									<option value="3">4800</option>
									<option value="4">9600</option>
									<option value="5">19200</option>
									<option value="6">38400</option>
									<option value="7">57600</option>
									<option value="8">115200</option>
								</select>
							</div>
							<div class="layui-inline">
								<button type="button" class="layui-btn layui-btn-sm" id="BAD4">配置</button>
							</div>
						</div>
						<div class="layui-form-item">
							<label class="layui-form-label">效验位</label>
							<div class="layui-inline">
								<select name="CHC4" lay-search="">
									<option value="0">N无校验</option>
									<option value="1">E偶校验</option>
									<option value="2">O奇校验</option>
								</select>
							</div>
							<div class="layui-inline">
								<button type="button" class="layui-btn layui-btn-sm" id="CHC4">配置</button>
							</div>
						</div>

					</div>
				</div>
			</div>
		</div>
	</div>
	<div class="layui-row layui-col-space15 layui-form" lay-filter="form-high">
		<div class="layui-col-md6">
			<div class="layui-card">
				<div class="layui-card-header">COM5</div>
				<div class="layui-card-body">
					<div class="">
						<div class="layui-form-item">
							<label class="layui-form-label">波特率</label>
							<div class="layui-inline">
								<select name="BAD1" lay-search="">
									<option value="0">600</option>
									<option value="1">1200</option>
									<option value="2">2400</option>
									<option value="3">4800</option>
									<option value="4">9600</option>
									<option value="5">19200</option>
									<option value="6">38400</option>
									<option value="7">57600</option>
									<option value="8">115200</option>
								</select>
							</div>
							<div class="layui-inline">
								<button type="button" class="layui-btn layui-btn-sm" id="BAD5">配置</button>
							</div>
						</div>
						<div class="layui-form-item">
							<label class="layui-form-label">效验位</label>
							<div class="layui-inline">
								<select name="CHC5" lay-search="">
									<option value="0">N无校验</option>
									<option value="1">E偶校验</option>
									<option value="2">O奇校验</option>
								</select>
							</div>
							<div class="layui-inline">
								<button type="button" class="layui-btn layui-btn-sm" id="CHC5">配置</button>
							</div>
						</div>

					</div>
				</div>
			</div>
		</div>
		<div class="layui-col-md6">
			<div class="layui-card">
				<div class="layui-card-header">COM6</div>
				<div class="layui-card-body">
					<div class="">
						<div class="layui-form-item">
							<label class="layui-form-label">波特率</label>
							<div class="layui-inline">
								<select name="BAD2" lay-search="">
									<option value="0">600</option>
									<option value="1">1200</option>
									<option value="2">2400</option>
									<option value="3">4800</option>
									<option value="4">9600</option>
									<option value="5">19200</option>
									<option value="6">38400</option>
									<option value="7">57600</option>
									<option value="8">115200</option>
								</select>
							</div>
							<div class="layui-inline">
								<button type="button" class="layui-btn layui-btn-sm" id="BAD6">配置</button>
							</div>
						</div>
						<div class="layui-form-item">
							<label class="layui-form-label">效验位</label>
							<div class="layui-inline">
								<select name="CHC6" lay-search="">
									<option value="0">N无校验</option>
									<option value="1">E偶校验</option>
									<option value="2">O奇校验</option>
								</select>
							</div>
							<div class="layui-inline">
								<button type="button" class="layui-btn layui-btn-sm" id="CHC6">配置</button>
							</div>
						</div>

					</div>
				</div>
			</div>
		</div>
	</div>

	<div class="layui-btn-container loukou-config-btn">
		<button type="button" class="layui-btn layui-btn-normal" id='getconfig'>获取配置</button>
	</div>
	<div class="layui-btn-container loukou-config-btn">
		<button type="button" class="layui-btn layui-btn-normal" id='send-tou-chuan'>发送透传</button>
	</div>
</div>



<script>
	layui.use(['form', 'table'], function () {
		var form = layui.form,
			layer = layui.layer,
			table = layui.table,

			$ = layui.$;

		/**
		 * 初始化表单，要加上，不然刷新部分组件可能会不加载
		 */
		form.render();
		// 当前弹出层，防止ID被覆盖
		var parentIndex = layer.index;

		// //赋值
		// form.val('form-high', {
		// 	PIDEN0: 1,
		// 	PIDKI0: '1234'
		// })
		//取值 表单中所有值
		// var form_high = form.val('form-high')

		var btnfunc = {
			loadId: -1,
			ajax: function (url, data, type, callback) {
				$.ajax({
					url: url,
					type: type,
					data: data,
					dataType: 'json',
					beforeSend: function () { //当一个Ajax请求开始时触发
						btnfunc.loadId = layer.load();//,{content:'正在加载中....'}); //打开layui加载效果
					},
					success: function (data) {
						layer.close(btnfunc.loadId)
						callback(data)

					}, error: function (res) {
						console.log(res)
						layer.msg('请求失败', { icon: 2, time: 3000 })
						layer.close(btnfunc.loadId)
					}
				})
			},
			getconfig: function () {
				btnfunc.ajax('/xapi/loukouconfig', '', 'get', function (data) {
					if (data != null) {
						form.val('form-high', data)
					}
				})

			},

		}
		$('.loukou-config-rw').on('click', '.layui-btn', function () {
			var self = $(this)
			var id = self.attr('id')
			console.log(id)
			if (!Object.prototype.hasOwnProperty.call(btnfunc, id)) {
				layer.msg('当前按钮未绑定事件', { icon: 0, time: 3000 });
				return
			}
			btnfunc[id]()
		})
		btnfunc.getconfig()
	});
</script>